<template>
  <el-card class="content small-padding-card">
    <top-label v-model="index" class="move-up">
      <span :slot="0">监测点变化分析</span>
      <span :slot="1">人工与在线监测比对</span>
      <span :slot="2">数据统计</span>
    </top-label>
    <single-point-analysis
      :node="nodes"
      
      v-if="index === 0"
    ></single-point-analysis>
    <comparison-automation
      v-if="index === 1"
      :node="nodes"
    ></comparison-automation>
    <data-statistics v-if="index === 2" :node="nodes"></data-statistics>
  </el-card>
</template>

<script>
import TopLabel from "~/components/TopLabel";
import ComparisonAutomation from "~/views/monitor-control/statistical-analysis/minimum-length/ComparisonAutomation";
import SinglePointAnalysis from "~/views/monitor-control/statistical-analysis/minimum-length/SinglePointAnalysis";
import DataStatistics from "~/views/monitor-control/statistical-analysis/minimum-length/DataStatistics";
export default {
  name: "SurfaceDisplacement",
  components: {
    DataStatistics,
    SinglePointAnalysis,
    ComparisonAutomation,
    TopLabel,
  },
  props: {
    node: Object,
  },
  data() {
    return {
      index: 0,
      nodes: {},
    };
  },
  created() {
    this.nodes = this.node;
    if (window.sessionStorage.getItem("indexmi") != null) {
      this.index =Number(window.sessionStorage.getItem("indexmi"));
    }
  },
  watch: {
    index: function (indexmi, oldVal) {
     window.sessionStorage.setItem("indexmi", indexmi);
      // console.log(val);
    },
  },
};
</script>

<style scoped>
.content {
  margin-left: 10px;
  padding-top: 5px;
  height: 87vh;
}
.move-up {
  transform: translateY(-5px);
}
</style>
